<template>
	<scroll-view class="home-list" scroll-y @scrolltolower="scroll" :refresher-triggered="triggered"
		:refresher-threshold="100" @refresherrestore="onRestore" refresher-enabled @refresherrefresh="onRefresh"
		:ower-threshold="0">
		<template v-if="arr && arr.length > 0">
			<MyTable :columns="materialColumns" :dataSource="arr">
				<template slot-scope="{ row }" slot="action">
					<view style="display: flex;flex-direction: row;">
						<u-button type="error" size="small" v-if="row.approvalResults == '待审批' && $has('materialReject')"
							@click="open(row,false)" text="驳回"></u-button>
						<u-button type="primary" size="small" v-if="row.approvalResults == '待审批' && $has('materialAdopt')"
							@click="open(row,true)" text="通过"></u-button>
					</view>
				</template>
			</MyTable>
		</template>
		<template v-else>
			<view class="info-box">
				<Empty />
			</view>
		</template>
		<view class="loading animation-scale-up" v-if="loading"></view>
		<view class="scroll-no-data" v-if="scrollNoData">已拉到最底部</view>

		<MyModal v-model="modalShow" title="" content="是否确认通过？" @confirm="modalConfirm" :showCancelButton="true"
			@cancel="modalShow = false">
			<u-input class="box-input" v-model="reasonForApproval" placeholder="请输入驳回原因" clearable
				v-if="viewType==false"></u-input>
		</MyModal>
	</scroll-view>
</template>

<script>
	import {
		setPageData
	} from "@/store/user";
	import Empty from "@/components/empty";
	import MyTable from "@/components/myTable.vue";
	import MyModal from "@/components/myModal";
	import fetch from '@/utils/fetch';

	import {
		setToken,
		getToken,
		getUserInfo,
		getNotice
	} from "@/store/user.js";
	export default {
		components: {
			Empty,
			MyTable,
			MyModal
		},
		props: {
			data: {
				type: Array,
				default: [],
			},
			scrollNoData: {
				type: Boolean,
				default: false,
			},
		},
		watch: {
			data: {
				handler: function(val, oldVal) {
					this.arr = val;
				},
				deep: true,
				immediate: true,
			},
		},
		data() {
			return {
				modalShow: false,
				viewType: false,
				reasonForApproval: '',
				rowId: '',

				loading: true,
				noData: false,
				arr: [],
				triggered: false,
				radioGroup: "",
				materialColumns: [{
						title: "操作",
						key: "action",
						slot: 'action'
					},
					{
						title: "班次",
						key: "shift",
					},
					{
						title: "物料名称",
						key: "deviceCode",
					},
					{
						title: "方式",
						key: "feedingStatus",
					},
					{
						title: "批次号",
						key: "materialBatch",
					},
					{
						title: "班次日期",
						key: "shiftTime",
					},
					{
						title: "数量",
						key: "weight",
					},
					{
						title: "操作人",
						key: "operator",
					},
					{
						title: "操作时间",
						key: "operatorTime",
					},
				],
			};
		},
		onReady: async function() {},
		onPullDownRefresh() {
			uni.stopPullDownRefresh();
		},
		mounted() {},
		methods: {
			modalConfirm() {
				if (this.viewType == false && !!this.reasonForApproval == false) {
					uni.$emit("openToast", {
						type: "error",
						title: "请输入驳回原因",
					});
					return;
				}
				fetch('post', '/dms/materialOperation/materialApproval', {
					id: this.rowId,
					reasonForApproval: this.reasonForApproval,
					status: this.viewType ? '成功' : '失败',
				}).then((res) => {
					this.modalShow = false;
					this.$emit("onRefresh");
				});
			},
			open(row, type) {
				this.rowId = row.id;
				this.viewType = type;
				this.modalShow = true;
			},
			clickMore(index) {
				this.$set(this.arr, index, {
					...this.arr[index],
					showMore: !this.arr[index].showMore,
				});
			},
			getColor(item2) {
				return item2 == "待排产" ?
					"#E5963A" :
					item2 == "已排产" ?
					"#998BF2" :
					item2 == "下发" ?
					"#6BBEE1" :
					item2 == "生产" ?
					"#73D8A6" :
					item2 == "中断" ?
					"#D48B3E" :
					item2 == "暂停" ?
					"#D8BE49" :
					item2 == "完成" ?
					"#4668E2" :
					item2 == "转产中" ?
					"#E794C9" :
					item2 == "转产完成" ?
					"#C25BC6" :
					item2 == "调机中" ?
					"#D8B2F2" :
					item2 == "调机完成" ?
					"#8698F6" :
					item2 == "拆模" ?
					"#EA709F" :
					"#31b099";
			},
			setLoading(val) {
				this.loading = val;
			},
			scroll(e) {
				const that = this;
				if (!that.noData) {
					this.loading = true;
					this.$emit("scrollBottom", (val) => {
						that.noData = val;
						setTimeout(() => {
							this.loading = false;
						}, 400);
					});
				}
			},
			onRefresh() {
				if (this._freshing) return;
				this._freshing = true;
				this.triggered = true;
				this.$emit("onRefresh");
				setTimeout(() => {
					this.triggered = false;
					this._freshing = false;
				}, 1000);
			},
			onRestore() {
				this.triggered = "restore"; // 需要重置
			},
			itemClick(item) {
				if (this.type !== "1") return;
				setPageData(item);
				this.$emit("itemClick", item);
			},
			ok(val) {
				this.$emit("ok", val);
			},
		},
	};
</script>

<style lang="scss" scoped>
	.home-list {
		flex: 1;
		height: 100%;
		min-height: 200rpx;
		background-color: #fff;

		.title {
			font-size: 32rpx;
			padding: 10px 40rpx;
			border-bottom: 1px solid #e0e0e0;
			display: flex;
			align-items: center;

			.txt {
				flex: 1;
			}

			.tag-box {
				display: flex;
				align-items: center;
			}
		}
	}
</style>